<template>
	<view style="padding: 10px;">
		<!-- 注意，如果需要兼容微信小程序，最好通过setRules方法设置rules规则 -->
		<u--form
				labelPosition="left"
				:model="form"
				ref="uForm"
				labelWidth="70"
		>
			<u-form-item
					label="手机号:"
					prop="form.username"
					borderBottom
			>
				<u--input
						v-model="form.username"
						border="none"
						placeholder="请输入手机号"
				></u--input>
			</u-form-item>
			<u-form-item
					label="密码:"
					prop="tpassword"
					borderBottom
			>
				<u--input
						placeholder="不输入则不修改"
						:password="true"
						v-model="tpassword"
						border="none"
						
				></u--input>
			</u-form-item>
			<u-form-item
					label="电话:"
					prop="form.phone"
					borderBottom
			>
				<u--input
						placeholder="请输入电话"
						v-model="form.phone"
						border="none"
						
				></u--input>
			</u-form-item>
			<view style="margin-bottom: 3px;margin-top: 3px;">
				<u-button @click="cleanForm" type="error"  text="清空"></u-button>
			</view>
			<u-button @click="submitClick" type="primary" text="更新"></u-button>
		</u--form>
	</view>
</template>

<script>
import {updateUsers} from "@/api/users.js"
export default {
	data() {
		return {
			form: {
				userId:0,
				username:'',
				password:null,
				phone:'',
			},
			tpassword:''
		};
	},
	onLoad() {
		this.$store.dispatch('setUserInfoActions');
		this.form.userId=this.$store.state.userInfo.userId;
		this.form.username=this.$store.state.userInfo.username;
		this.form.phone=this.$store.state.userInfo.phone;
	},
	methods: {
		cleanForm(){
		  for (const key in this.form) {
			if (this.form.hasOwnProperty(key)) { // 避免遍历原型链上的属性
			  this.form[key] = null;
			}
		  }
		  this.tpassword='';
		},
		submitClick(){
			if(this.tpassword!==''){
				this.form.password=this.tpassword;
			}
			updateUsers(this.form).then(res=>{
				this.$store.dispatch('setUserInfoActions');
				uni.navigateBack();
			})
		}
	},

};
</script>
